<template>
  <div class="wrap">
    <div class="logo">
      <h1>404</h1>
      <p>The Page not Found-找不到你要访问的页面</p>
      <div class="sub">
        <p><a href="/">返回首页</a></p>
      </div>
    </div>
  </div>
</template>
<style scoped lang="scss">
body {
  background: #f3f3e1;
}

.wrap {
  padding: 2rem ;
  margin: 0 auto;
  width: 12rem;
}

.logo {
  margin-top: 5/8rem;
}

.logo h1 {
  font-size: 2.5rem;
  color: #8F8E8C;
  text-align: center;
  margin-bottom: 1px;
  text-shadow: 1px 1px 6px #fff;
}

.logo p {
  margin-top: 0.8rem;
  color: rgb(228, 146, 162);
  font-size: 0.25rem;
  text-align: center;
}

.logo p span {
  color: lightgreen;
}

.sub a {
  display: inline-block;
  color: #fff;
  background: linear-gradient(61deg, #47ffda 0%, #2e6aff 100%);
  text-decoration: none;
  padding: 0.2rem 1.5rem;
  border-radius: 1rem;
  font-size: 0.23rem;
  font-family: arial, serif;
  font-weight: bold;
  margin-top: 1rem;
}
</style>
<script setup lang="ts">
// definePageMeta({
//   layout:'404',
//   index: 2,
// })
useHead({
  titleTemplate: "404-%s"
});
</script>
